<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

	<div class="flex just-content-between top-box">
		<div class="flex top-l-box">
			<span th:text="${kh.watermark}">欢迎进入汽车产业博览会~</span>
			<span th:text="${pt400.watermark}">服务热线：400-111-2222</span>
		</div>
		<div class="flex align-end top-r-box">
			<img src="img/r_bg.png" alt="">
			<div class="top-r-nav">
				<a>中文 / EN</a>
				<a class="login-type" onclick="userLogin(0)">观众入口</a>
				<a class="login-type" onclick="userLogin(1)">展商入口</a>
				<div class="top-r-user">
					<a href="user.html">个人中心</a>
					<div class="top-r-user-box">
						<a target="_blank" href="/user.html">个人资料</a>
						<a target="_blank" href="/userPass.html">密码管理</a>
						<a target="_blank" href="/userMessage.html">我的留言</a>
						<a target="_blank" href="/userCollect.html">我的收藏</a>
						<a target="_blank" href="/userHistory.html">浏览历史</a>
					</div>
				</div>
				<a class="shht" target="_blank" href="http://122.14.195.113:8089/carshow-back/#/login">商户后台</a>
				<div class="top-r-user">
					<a class="top-r-user" onclick="logOut()">退出</a>
				</div>
			</div>
		</div>
	</div>
	<div class="nav clearfix">
		<a href="/index.html" class="nav-logo flex align-center">
			<img src="img/logo.png" alt="">
			<span></span>
			<img src="img/logo_text.png" alt="">
		</a>
		<div class="nav-right flex align-center">
			<div class="nav-r-ul flex">
				<a href="/index.html">首页</a>
				<a href="/productList.html">产品中心</a>
				<a href="/news.html">新闻发布</a>
				<a href="/activity.html">同期活动</a>
				<a href="/business.html">采购项目</a>
			</div>
			<div class="nav-r-search">
				<input class="nav-r-ipt" name="search" type="text" autocomplete="off" placeholder="请输入查询内容">
				<i class="fa fa-search" onclick="goSearch()"></i>
				<div class="search-reply">
					<!-- <a href="">ssss</a> -->
				</div>
			</div>
		</div>
	</div>
	<style>
		.search-reply {
			position: absolute;
			left: 0;
			right: 0;
			top: 31px;
			/* height: 200px; */
			background: #fff;
			padding: 0 15px;
			box-shadow: 0 0 10px #ccc;
			overflow-y: auto;
			height: 0;
			transition: height ease-in-out .2s;
			box-sizing: border-box;
		}

		.search-reply a {
			display: block;
			line-height: 26px;
			border-bottom: 1px dashed #999;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;

		}

		.search-reply a:first-child {
			margin-top: 8px;
		}

		.search-reply a:last-child {
			margin-bottom: 8px;
		}

		.search-reply a:hover {
			color: #2888c4;
		}
	</style>
	<script>
		// 用户登录显示
		$(function() {
			var userId = getCookie("userId");
			if (userId) {
				$('.login-type').hide()
				$('.top-r-user').css('display', 'inline-block')
			}
			var userInfo = getCookie("userInfo");
			if (userInfo) {
				userInfo = JSON.parse(userInfo)
				console.log(userInfo);
				if (userInfo.type == 1) {
					$('.shht').show()
				}
			}
		});

		function goSearch() {
			var search = $('.nav-r-ipt').val()
			$('.search-reply').html('')
			if (search) {
				$.ajax({
					url: baseUrl + '/car-admin/search/product/index',
					type: 'GET',
					data: {
						keywords: search
					},
					dataType: 'json', //后台返回的数据类型是json文本
					success: function(result) {
						if (result != "" && result.code == 0) {
							result.data.forEach(item => {
								let html =
									`<a href="${'product/detail/'+item.id+'.html'}">${item.productName}</a>`
								$('.search-reply').append(html)
							})
							$('.search-reply').css('height', '200px')
						}
					}
				})
			}
		}
	</script>
</html>
